<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>  
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>首页</title>
<meta name="keywords" content="西山居,西山居游戏,西山居概念官网,剑网3,剑侠世界,招聘" /> 
<meta name="Description" content="西山居是国内老牌知名游戏公司，以游戏的方式，创造快乐，传递快乐。" />
<link rel="stylesheet" href="../css/common.css" />
<script src="../js/jquery.easing.js" ></script>
<script src="../js/delayloading.js" ></script>
<script src="../js/jquery.shCircleLoader.js" type="text/javascript"></script>
<link href="../css/jquery.mCustomScrollbar.css" rel="stylesheet" /> 
<link rel="stylesheet" href="../css/about.css" />
<script src="../js/jquery.mCustomScrollbar.concat.min.js"></script>
	<script>
	$('#loading').shCircleLoader();
	$(window).load(function(){
		$('#loading').hide();
		$(".cont").css("display","block");
		$(".tag").delayLoading({
		speed:"data-s",
		direction:"top"
		})
		$("#article").mCustomScrollbar({
					scrollButtons:{
						enable:true
					}
				});
		
	})
		
		
	</script>    
	
	<style>
    body {
        background-color: #000000;
        margin: 0px;
        overflow: hidden;
        font-family:Arial,Microsoft Yahei;
    }

    a {
        color:#999;
        text-decoration:none;
    }
    #nav{width:100%;height:80px;background-color:#fff;position:fixed;top:0;}
    #nav ul{width:820px;height:80px;margin:10px auto;}
    #nav ul li{float:left;list-style:none; height:70px;margin:0 40px;cursor:pointer;}
    #nav ul li a{font-size:16px;line-height:50px;color:#494949;text-decoration:none;}
    #nav ul li:hover a{color:#070503;}
    #ie_img{height:900px;background:url(../img/index_bg.jpg) no-repeat center;}
    #b0{position:absolute; left:50%;margin-left:-194px;top:300px;}
    #b1{position:absolute; left:20%;margin-left:-73px;top:260px;}
    #b2{position:absolute; left:80%;margin-left:-73px;top:270px;}
    #b3{position:absolute; left:30%;margin-left:-73px;top:410px;}
    #b4{position:absolute; left:70%;margin-left:-73px;top:410px;}
    .divs{width:100px;height:60px;position:absolute;margin-left:-50px;margin-top:-30px;cursor:pointer;}
    #div0{width:200px;margin-top:50px;margin-left:-100px;}
</style>
</head>
<body>
		<div id="nav">
			<ul>
				<li><a href="index/rendPage?type=index&modelId=1">概述xx</a></li>
				<li><a href="index/rendPage?type=index&modelId=3">产品</a></li>
				<li>西山居</li>
				<li><a href="index/employer/show">员工介绍</a></li>
				<li><a href="index/message">留言</a></li>
			</ul>
		</div>
		<div class="footer" style="position:fixed; bottom:0;" >
		<p>© 1995-2013 Seasun Entertainment <span>西山居娱乐</span> 版权所有;<br /><a href="http://www.miibeian.gov.cn/state/outPortal/loginPortal.action" target="_blank">备案号:川B2-20060117-9</a></p>
		<div class="footer_r">
			<div class="zhaopin"><a href="http://hr.xishanju.com/" target="_bank">西山居招聘</a></div>
			<div class="zhongxin"><a href="http://art.xishanju.com/" target="_bank">西山居美术中心</a></div>
			<div class="xoyo"><a class="foot01" href="http://www.xoyo.com/" target="_bank"><img src="./public/images/foot_02.png" alt="" /></a>
			<a class="foot02" href="https://hk.xoyobox.com/" target="_bank"><img src="./public/images/foot_01.png" alt="" /></a></div>
		</div>
		</div>
	 <div id="recl" style="position:fixed; z-index:1001; width:100px; height:50px; top:50%;left:50%; margin-top:-25px;margin-left:-50px; background-color:#ffffff; display:none" ></div>
		<div class="divs" id="div0"></div>
		<div class="divs" id="div1"></div>
		<div class="divs" id="div2"></div>
		<div class="divs" id="div3"></div>
		<div class="divs" id="div4"></div>
		<!--[if lt IE 10]>
		<div id="ie_img">
			<a href="#" id="b0"><img src="../img/center.png" alt="" /></a>
			<a href="./about.html" id="b1"><img src="../img/b1.png" alt="" /></a>
			<a href="./master.html" id="b2"><img src="../img/b2.png" alt="" /></a>
			<a href="./culture.html" id="b3"><img src="../img/b3.png" alt="" /></a>
			<a href="./product.html" id="b4"><img src="../img/b4.png" alt="" /></a>
		</div>
		<![endif]-->
		<!--
		<div style="position:absolute; z-index:1001; width:100px; height:100px; margin-top:100px;" >
			<input id="t1" type="text" value="aaa"  />
		</div>
		<div style="position:absolute; z-index:1002; width:100px; height:100px; margin-top:150px;" >
			<input id="t2" type="text" value="aaa"  />
		</div>
		<div style="position:absolute; z-index:1003; width:100px; height:100px; margin-top:200px;" >
			<input id="t3" type="text" value="aaa"  />
		</div>
		<div style="position:absolute; z-index:1004; width:100px; height:100px; margin-top:250px;" >
			<input id="t4" type="text" value="aaa"  />
		</div>
		<div style="position:absolute; z-index:1005; width:100px; height:100px; margin-top:300px;" >
			<input id="t5" type="text" value="aaa"  />
		</div>
		<div style="position:absolute; z-index:1006; width:100px; height:100px; margin-top:350px;" >
			<input id="t6" type="text" value="aaa"  />
		</div>
	   -->
		<script src="../js/three.min.js"></script>
        <script src="../js/stats.min.js"></script><!--显示FPS状态类-->
        <script src="../js/TrackballControls.js"></script><!--触碰控制类-->
        <script src="../js/tween.min.js"></script><!--动画移动类-->
		<script>
       
			var mouseX = 0, mouseY = 0,isMove=false,canMouse=true,maxX,maxY,maxZ,isBacked=true,line,

			windowHalfX = window.innerWidth / 2,
			windowHalfY = window.innerHeight / 2,
			SEPARATION = 200,
			AMOUNTX = 10,
			AMOUNTY = 10,
            pArray=[],
            isShowing=false,
            isMoving=false,
            isBacking=false,
            isControlBack=false,
            isControlGo=false,
			camera, scene, renderer,Stats,particle0,particle1,particle2,particle3,particle4,particleMain,rx,ry,rz,mX=0,mY=0,particleH,nx,ny,goIndex=1;

			var t1=document.getElementById('t1');
			var t2=document.getElementById('t2');
			var t3=document.getElementById('t3');
			var t4=document.getElementById('t4');
			var t5=document.getElementById('t5');
			var t6=document.getElementById('t6');
			init();
			animate();
			
			function move(){
			
			   canMouse=false;
			   isShowing=true;
			   isMoving=true;
			   isControlBack=false;
			   isControlGo=false;
			   var ax = 360 * Math.PI / 180;
               new TWEEN.Tween( particleH.rotation ).to( {
                           x: 0,//-400-400
                           y: 0,  
                           z: 0 }, 3000 )
                               .easing( TWEEN.Easing.Cubic.In).start();
               new TWEEN.Tween( particleH.position ).to( {
                           x: nx,//-400-40
                           }, 3000 )
                               .easing( TWEEN.Easing.Cubic.In).start();
               var tn=new TWEEN.Tween( particleH.position ).to( {
                           y: ny,
                           z: 1530 }, 3000 )

                               .easing( TWEEN.Easing.Cubic.In).start();
                               

               tn.onComplete(function() {
                   
                      document.getElementById("recl").style.display="block";
                      last();
               });                

			   
			}

			function last(){
                
                var tn=new TWEEN.Tween( { x: 100} ).to( {
                           x:10000
                           }, 1000 )

                               .easing( TWEEN.Easing.Cubic.Out).start();
                               

               tn.onComplete(function() {
						
                    if(goIndex==1){//概述
						
                    	var tohref="index/rendPage?type=index&modelId=1";
                    }else if(goIndex==2){//产品

                    	var tohref="index/rendPage?type=index&modelId=3";
                    }else if(goIndex==3){//员工

                    	var tohref="index/employer/show";
                    }else if(goIndex==4){//留言

                    	var tohref="index/message";
                    }else if(goIndex==0){//中间
						var tohref="./master.html";
					}
				   
                      window.location.href=tohref;
               });
               tn.onUpdate(function() {
                   
                      document.getElementById("recl").style.width=this.x+"px";
                      document.getElementById("recl").style.height=this.x/2+"px";
                      document.getElementById("recl").style.marginLeft=-this.x/2+"px";
                      document.getElementById("recl").style.marginTop=-this.x/2/2+"px";
               });     

			}
			
			function closes(){
			
			   if(!isShowing){
			     canMouse=true;
			     isControlGo=false;
			   }
			   
			}


			function init() {

				var container,btn, separation = 100, amountX = 50, amountY = 50,
				particles, particle;

				container = document.createElement('div');

				//btn.innerHTML="<div style='width:100px; height:100px;' ><input type='button' onclick='' value='click'  /></div>";
				document.body.appendChild(container);

				camera = new THREE.PerspectiveCamera( 20, window.innerWidth / window.innerHeight, 1, 10000 );
                camera.position.y = 300;
                camera.position.z = 1600;
               // camera.position.z = 1700;


                //控制视角转动
                controls = new THREE.TrackballControls( camera );

				scene = new THREE.Scene();

                projector = new THREE.Projector();

				renderer = new THREE.CanvasRenderer();
				renderer.setSize( window.innerWidth, window.innerHeight );
				container.appendChild( renderer.domElement );
				
				
				// particles

				var PI2 = Math.PI * 2;

                var material2 = new THREE.SpriteCanvasMaterial( {

                    color: 0xffffff,
                    program: function ( context ) {

                        context.beginPath();
                        context.fillStyle="#ffffff";
                        context.arc( 0, 0, 0.2, 0, PI2, true );
                        context.fill();

                    }

                } );
                particleH = new THREE.Sprite(  );
                scene.add( particleH );
                var geometry = new THREE.Geometry();
                
//                把100个白点，制作为精灵，并添加到
                var i = 0;
                for ( i = 0; i < 300; i ++ ) {

                    particle = new THREE.Sprite( material2 );
					particle.position.x = Math.random() * 2 - 1;//-1 - 1
					particle.position.y = Math.random() * 2 - 1;
					particle.position.z = Math.random() * 2 - 1;
                    particle.position.normalize();
                    particle.position.multiplyScalar( Math.random() * 10 + 150 );
                    particle.scale.x = particle.scale.y = 2.5;
                    particleH.add( particle );
                    pArray.push(particle);
                    geometry.vertices.push( particle.position );
                }

                for ( i = 0; i < 100;i ++ ) {

                    particle = new THREE.Sprite( material2 );
					particle.position.x = Math.random() * 2 - 1;//-1 - 1
					particle.position.y = Math.random() * 2 - 1;
					particle.position.z = Math.random() * 2 - 1;
                    particle.position.normalize();
                    particle.position.multiplyScalar( Math.random() * 10 + 300 );
                    particle.scale.x = particle.scale.y = 1.6;
                    particleH.add( particle );
                    pArray.push(particle);
                    geometry.vertices.push( particle.position );
                }

                for ( i = 0; i < 200; i ++ ) {

                    particle = new THREE.Sprite( material2 );
					particle.position.x = Math.random() * 2 - 1;//-1 - 1
					particle.position.y = Math.random() * 2 - 1;
					particle.position.z = Math.random() * 2 - 1;
                    particle.position.normalize();
                    particle.position.multiplyScalar( Math.random() * 10 + 500 );
                    particle.scale.x = particle.scale.y = 0.8;
                    particleH.add( particle );
                    pArray.push(particle);
                    geometry.vertices.push( particle.position );
                }

                for ( i = 0; i < 100; i ++ ) {

                    particle = new THREE.Sprite( material2 );
					particle.position.x = Math.random() * 2 - 1;//-1 - 1
					particle.position.y = Math.random() * 2 - 1;
					particle.position.z = Math.random() * 2 - 1;
                    particle.position.normalize();
                    particle.position.multiplyScalar( Math.random() * 10 + 650 );
                    particle.scale.x = particle.scale.y = 0.5;
                    particleH.add( particle );
                    pArray.push(particle);
                    geometry.vertices.push( particle.position );
                }

                var material = new THREE.SpriteCanvasMaterial( {

                    color: 0xffffff,
                    program: function ( context ) {

                        context.beginPath();
                        context.fillStyle="#ff0000";
                        context.arc( 0, 0, 0.5, 0, PI2, true );
                        context.fill();

                    }

                } );
                //星座坐标数组
                var XX={
                    a:[
                            [0,0,0],
                            [-400,100,10],
                            [-200,-60,30],
                            [400,-25,10],
                            [220,70,50],
     

                        ],

                   
                    
                }

                var imgArray=["../img/center.png","../img/b1.png","../img/b2.png","../img/b3.png","../img/b4.png"];
                var sizeArray=[[387,167],[106,43],[106,43],[106,43],[106,43]];




                var geometry = new THREE.Geometry();
                //把100个红点，制作为精灵，并添加到
                
				for ( var i = 0; i < 5; i ++ ) {
                    
                    	var texture = THREE.ImageUtils.loadTexture(imgArray[i]); // Create texture object based on the given bitmap path.
    var materialm = new THREE.MeshPhongMaterial({ map: texture }); // Create a material (for the spherical mesh) that reflects light, potentially causing sphere surface shadows.
    materialm.depthTest=false;
    materialm.depthWrite=false;
    var geometrym = new THREE.PlaneGeometry(sizeArray[i][0],sizeArray[i][1],5,5); // Radius size, number of vertical segments, number of horizontal rings.

    particle = new THREE.Mesh(geometrym, materialm);

                    
					
                    particle.position.x =  XX.a[i][0];
                    particle.position.y =  XX.a[i][1];
                    particle.position.z =  XX.a[i][2];
					//particle.position.normalize();
					//particle.position.multiplyScalar( Math.random() * 10 + 450 );
					
					particle.scale.x = particle.scale.y = 1;
					
					particleH.add( particle );


                    if(i==1){

                    	particle1=particle;
                    }else if(i==2){

                    	particle2=particle;
                    }else if(i==3){

                    	particle3=particle;
                    }else if(i==4){

                    	particle4=particle;
                    }else if(i==0){

                        particle0=particle;
                    }

                    geometry.vertices.push( particle.position );
					
					
					//particle.addEventListener( 'mousedown', onMouseDown, true );
				}


    

                

//				document.addEventListener( 'mousemove', onDocumentMouseMove, false );
//				document.addEventListener( 'touchstart', onDocumentTouchStart, false );
//				document.addEventListener( 'touchmove', onDocumentTouchMove, false );

				//
                document.addEventListener( 'mousedown', onMouseDown, false );
                document.addEventListener( 'mousemove', onDocumentMouseMove, false );
               // document.addEventListener( 'mouseup', onDocumentMouseUp, false );
                //窗口实时尺寸修改
				window.addEventListener( 'resize', onWindowResize, false );
				
                window.addEventListener( 'resize', getcode, false );
				
                  /*
                stats = new Stats();
                stats.domElement.style.position = 'absolute';
                stats.domElement.style.top = '0px';
                container.appendChild( stats.domElement );
				*/
				//camera.lookAt( particle1.position );
			}
			
			function getcode(){
				var halfWidth = window.innerWidth / 2;  
                var halfHeight = window.innerHeight / 2;  
                 var projector = new THREE.Projector();  
  
                 var vector1 = new THREE.Vector3();
                 //projector.projectVector(vector1.getPositionFromMatrix( particle1.matrixWorld ), camera);  
                 var xc1=Math.round(vector1.x * halfWidth + halfWidth);
                 var yc1=Math.round(-vector1.y * halfHeight + halfHeight);

                 var vector2 = new THREE.Vector3();
                 //projector.projectVector(vector2.getPositionFromMatrix( particle2.matrixWorld ), camera);  
                 var xc2=Math.round(vector2.x * halfWidth + halfWidth);
                 var yc2=Math.round(-vector2.y * halfHeight + halfHeight);

                 var vector3 = new THREE.Vector3();
                // projector.projectVector(vector3.getPositionFromMatrix( particle3.matrixWorld ), camera);  
                 var xc3=Math.round(vector3.x * halfWidth + halfWidth);
                 var yc3=Math.round(-vector3.y * halfHeight + halfHeight);

                 var vector4 = new THREE.Vector3();
                // projector.projectVector(vector4.getPositionFromMatrix( particle4.matrixWorld ), camera);  
                 var xc4=Math.round(vector4.x * halfWidth + halfWidth);
                 var yc4=Math.round(-vector4.y * halfHeight + halfHeight);
				 
				 var vector0 = new THREE.Vector3();
                // projector.projectVector(vector0.getPositionFromMatrix( particle0.matrixWorld ), camera);  
                 var xc0=Math.round(vector0.x * halfWidth + halfWidth);
                 var yc0=Math.round(-vector0.y * halfHeight + halfHeight);
				 
				 //console.log(xc4);
				 $("#div0").attr("style","top:"+yc0+"px; left:"+xc0+"px");
				 $("#div1").attr("style","top:"+yc1+"px; left:"+xc1+"px");
				 $("#div2").attr("style","top:"+yc2+"px; left:"+xc2+"px");
				 $("#div3").attr("style","top:"+yc3+"px; left:"+xc3+"px");
				 $("#div4").attr("style","top:"+yc4+"px; left:"+xc4+"px");
			}
			
			setInterval("getcode()",500);
			
			function onMouseDown(event){
				var halfWidth = window.innerWidth / 2;  
                var halfHeight = window.innerHeight / 2;  
                 var projector = new THREE.Projector();  
  
                 var vector1 = new THREE.Vector3();
                 projector.projectVector(vector1.getPositionFromMatrix( particle1.matrixWorld ), camera);  
                 var xc1=Math.round(vector1.x * halfWidth + halfWidth);
                 var yc1=Math.round(-vector1.y * halfHeight + halfHeight);

                 var vector2 = new THREE.Vector3();
                 projector.projectVector(vector2.getPositionFromMatrix( particle2.matrixWorld ), camera);  
                 var xc2=Math.round(vector2.x * halfWidth + halfWidth);
                 var yc2=Math.round(-vector2.y * halfHeight + halfHeight);

                 var vector3 = new THREE.Vector3();
                 projector.projectVector(vector3.getPositionFromMatrix( particle3.matrixWorld ), camera);  
                 var xc3=Math.round(vector3.x * halfWidth + halfWidth);
                 var yc3=Math.round(-vector3.y * halfHeight + halfHeight);

                 var vector4 = new THREE.Vector3();
                 projector.projectVector(vector4.getPositionFromMatrix( particle4.matrixWorld ), camera);  
                 var xc4=Math.round(vector4.x * halfWidth + halfWidth);
                 var yc4=Math.round(-vector4.y * halfHeight + halfHeight);
				 
				 var vector0 = new THREE.Vector3();
                 projector.projectVector(vector0.getPositionFromMatrix( particle0.matrixWorld ), camera);  
                 var xc0=Math.round(vector0.x * halfWidth + halfWidth);
                 var yc0=Math.round(-vector0.y * halfHeight + halfHeight);
				
				 
                 if(event.pageX>=xc1-50&&event.pageX<=xc1+50){

                     if(event.pageY>=yc1-50&&event.pageY<=yc1+50){
                          
                            nx=428;
                            ny=204;
							goIndex=1;
                            move();
						
                         // camera.lookAt( particle1.position );
 
                     }

                 }else if(event.pageX>=xc2-50&&event.pageX<=xc2+50){

                 	if(event.pageY>=yc2-50&&event.pageY<=yc2+50){

                            
                            nx=227;
                            ny=368;
							goIndex=2;
                            move();
                     }


                 }else if(event.pageX>=xc3-50&&event.pageX<=xc3+50){

                 	if(event.pageY>=yc3-50&&event.pageY<=yc3+50){

                            
                            nx=-371;
                            ny=329;
							goIndex=3;
                            move();
 
                     }


                 }else if(event.pageX>=xc4-50&&event.pageX<=xc4+50){

                 	if(event.pageY>=yc4-50&&event.pageY<=yc4+50){

                            
                            nx=-190;
                            ny=241;
							goIndex=4;
                            move();
 
                     }


                 }else if(event.pageX>=xc0-80&&event.pageX<=xc0+80){

                    if(event.pageY>=yc0-80&&event.pageY<=yc0+80){

                            
                            nx=0;
                            ny=300;
							goIndex=0;
                            move();
 
                     }


                 }

			}

			function onWindowResize() {

				windowHalfX = window.innerWidth / 2;
				windowHalfY = window.innerHeight / 2;

				camera.aspect = window.innerWidth / window.innerHeight;
				camera.updateProjectionMatrix();

				renderer.setSize( window.innerWidth, window.innerHeight );

			}



			function onDocumentTouchStart( event ) {

				if ( event.touches.length > 1 ) {

					event.preventDefault();

					mouseX = event.touches[ 0 ].pageX - windowHalfX;
					mouseY = event.touches[ 0 ].pageY - windowHalfY;

				}

			}

			function onDocumentTouchMove( event ) {

				if ( event.touches.length == 1 ) {

					event.preventDefault();

					mouseX = event.touches[ 0 ].pageX - windowHalfX;
					mouseY = event.touches[ 0 ].pageY - windowHalfY;

				}

			}

			//

			function animate() {

				requestAnimationFrame( animate );

				render();
              

			}

			function render() {
                   
				//particle2.position.x += ( particle1.position.x - particle2.position.x ) * .05;
			//	particle2.position.y += ( particle1.position.y - particle2.position.y ) * .05;
				//particle2.position.z += ( particle1.position.z - particle2.position.z ) * .05;
				
                 //camera.lookAt( particle2.position );
                
                if(canMouse){
                	if(!isBacked){
                		particle1.scale.x+=(3-particle1.scale.x)/3;
                        particle1.scale.y+=(3-particle1.scale.y)/3;
                		//isBacked=true;
                	    //controls.back();
                        for ( var i = 0; i < 420; i ++ ) {

                        	   pArray[i].material.opacity=1;
                         
                              
                        }


                        if(!isControlBack){
                        	isControlBack=true;
                           controls.back();
                        }
                        line.scale.x=1;
                        line.scale.y=1;
                        if(particle1.scale.x-3<=0.05){

                        	particle1.scale.x=3;
                        	particle1.scale.y=3;
                        	isBacked=true;
                            //controls.back();
                        }

                	}
                	//camera.position.y+=(-1-camera.position.y)*.05;
                  //controls.update();
                  /*
                  particleMain.rotation.y+=0.1;
                  particleMain.rotation.x+=0.1;
                  particleMain.rotation.z+=0.1;
                  */
                _loc_1 = mX - document.body.offsetWidth * 0.5;
	            _loc_2 = mY - document.body.offsetHeight * 0.5;
	            _loc_3 = Math.round(Math.sqrt(_loc_1 * _loc_1 + _loc_2 * _loc_2)) * 0.08;
			    _loc_4 = -((-_loc_1) * 0.08 * Math.PI / 180);
			    _loc_5 = _loc_2 * 0.08 * Math.PI / 180;
			    _loc_6 = _loc_1 * _loc_2 >= 0 ? (-Math.abs(_loc_3 * 0.1)) : (Math.abs(_loc_3 * 0.1));
			    _loc_6 = _loc_6 * Math.PI / 180;

                rx=_loc_5;
                ry=_loc_4;
                rz=_loc_6;

                particleH.rotation.x+=(rx-particleH.rotation.x)*0.05;
                particleH.rotation.y+=(ry-particleH.rotation.y)*0.05;
                particleH.rotation.z+=(rz-particleH.rotation.z)*0.05;
                  TWEEN.update();
				}else{
				    
                  TWEEN.update();
			    }
				camera.lookAt( scene.position );
				renderer.render( scene, camera );
                
			}

            function onDocumentMouseDown( event ) {

                event.preventDefault();
                mouseX = event.clientX - windowHalfX;
                mouseY = event.clientY - windowHalfY;
                //console.log("eventCX:"+event.clientX);
                //console.log("eventCY:"+event.clientY);
                //console.log("mouseX:"+mouseX);
                //console.log("mouseY:"+mouseY);
                isMove = true;
            }

            function onDocumentMouseMove(event) {

                mX=event.pageX;
                mY=event.pageY;
                

                /*
			    new TWEEN.Tween( particleMain.rotation ).to( {
                          x: _loc_5,//-400-400
                            y: _loc_4,
                           z: _loc_6 }, 1000 )
                                .easing( TWEEN.Easing.Quadratic.Out).start();
                */

//                if(isMove){
//                    var vector = new THREE.Vector3( ( event.clientX / window.innerWidth ) * 2 - 1, - ( event.clientY / window.innerHeight ) * 2 + 1, 0.5 );
//                    projector.unprojectVector( vector, camera );
//
//                    var raycaster = new THREE.Raycaster( camera.position, vector.sub( camera.position ).normalize() );
//
//                    var intersects = raycaster.intersectObjects( scene.children );
////                    console.log(intersects.length);
//                    if ( intersects.length > 0 ) {
////                        intersects[ 0 ].object.position.x=100;
//                        new TWEEN.Tween( intersects[ 0 ].object.position ).to( {
//                            x: Math.random() * 800 - 400,//-400-400
//                            y: Math.random() * 800 - 400,
//                            z: Math.random() * 800 - 400 }, 2000 )
//                                .easing( TWEEN.Easing.Elastic.Out).start();
//
////                        new TWEEN.Tween( intersects[ 0 ].object.rotation ).to( {
////                            x: Math.random() * 2 * Math.PI,
////                            y: Math.random() * 2 * Math.PI,
////                            z: Math.random() * 2 * Math.PI }, 2000 )
////                                .easing( TWEEN.Easing.Elastic.Out).start();
////
////                        console.log(mouseX+"   "+mouseY);
//                    }
//                }

            }
            function onDocumentMouseUp( event ) {

                event.preventDefault();
                isMove=false;
            }

            

		</script>
		<!--<div><canvas width="1366" height="634" style="width: 1366px; height: 634px;"></canvas></div>-->
<%-- 	<jsp:include page="footer.jsp" /> --%>
	
    
</body>
</html>
 